﻿@using WSS.Pub
@{
    ViewBag.Title = "HospList";
}

@{
    IList<StrObjDict> optList = ViewBag.HospOptData;
}
<div class="div_chooseLeft">
    <div class="panel panel-default">
        <div class="panel-heading">医院信息</div>
        <div class="panel-body form-inline">

            <label>名称：<input id="sch_hospname" type="text" style="width: 120px;" /></label>

            @Html.MyButton("btn_sch", "搜索")

        </div>

        <table id="maingrid"></table>
        <div class="panel-footer">
            <ul id="page1"></ul>
        </div>
    </div>


</div>
<div class="div_chooseRight">
    <div class="panel panel-default" style="margin-top: 5px">
        <div class="panel-heading">已选<span style="float: right; text-align: right; cursor: pointer" onclick="clearAllData()">清空</span></div>
        <div class="panel-body form-inline">

            <ul id="Ul_Hosp_ChoosedData">
                @if (optList != null && optList.Count > 0)
                {
                    foreach (var data in optList)
                    {
                    <li id='li_@data["VAL"]' detailID="@data["VAL"]">
                          <span class="label label-default">  @data["TEXT"]
                                <span onclick="deleteChooseData('@(data["VAL"])')"  class="delChoose">&times;</span></span>         

                    </li>  
                    }
                }
            </ul>

        </div>

    </div>

</div>

<div style="clear: both"></div>
@section css
{
    <style type="text/css">
        body
        {
            padding-top: 5px;
        }


        .div_chooseLeft
        {
            width: 445px;
            height: 100%;
            float: left;
            margin-right: 5px;
        }

        .div_chooseRight
        {
            width: 280px;
            float: left;
            height: 100%;
        }

        #Ul_Hosp_ChoosedData
        {
            list-style: none;
            width: 256px;
        }

            #Ul_Hosp_ChoosedData li
            {
                padding-top: 10px;
            }

        .delChoose
        {
            cursor: pointer;
            margin-left: 8px;
        }
    </style>
}
@section script
{
    <script src="@Url.Content("~/Scripts/plugins/bootstrap-paginator.min.js")"></script>
    <script src="@Url.Content("~/Scripts/plugins/jquery.grid.js")"></script>
    <script type="text/javascript">
        $(function () {
            $("#btn_sch").click(function () {
                sch();
            });

            function init(parameters) {

                $("#maingrid").bootgrid({
                    url: '/ResCenter/OptHospList/@(ViewBag.ResNo)',
                    pager: "page1",
                    pagesize: 5,
                    multiple: true,
                    headers: ["HOSP_ID", "名称", "资源编号"],
                    cols: [
                        { id: 'HOSP_ID', hidden: true },
                        { id: 'HOSP_NAME' },
                         { id: 'RES_NO', hidden: true }
                    ],
                    onclick: function (rowIndex, id, rowData) {
                        //判断当前行状态
                        var curTrClass = $("#maingrid tr[data-rowidx='" + rowIndex + "']").attr("class");
                        if (curTrClass != "" && curTrClass.indexOf("gridselrow") > -1) {
                            addDataToUl(rowData, rowIndex);
                        } else {
                            deleteChooseData(rowData.HOSP_ID);
                        }
                    },
                    onloaded: function () {
                        afterLoadGrid();
                    },
                    oncheckall: function (ckstate) {
                        clickAllChk(ckstate);
                    }
                });

            }

            init();
        });

        function sch() {
            $("#maingrid").bootgrid("setGridParam", { sch_hospname: $("#sch_hospname").val() });
            $("#maingrid").bootgrid("reloadGrid", { page: 1 });
        }

        function afterLoadGrid() {
            $("#maingrid tr").each(function (i) {
                if ($(this).find("td:eq(3)").text() != "") {
                    $(this).find("input:checkbox").attr("checked", "checked");
                    $(this).addClass("gridselrow");
                }
            });
        }

        function addDataToUl(row, rowIndex) {
            var retHtml = "";
            retHtml += "<li id=\"li_" + row.HOSP_ID + "\" detailID=\"" + row.HOSP_ID + "\">" +
                  "<span class=\"label label-default\"> " + row.HOSP_NAME +
                                "<span onclick=\"deleteChooseData('" + row.HOSP_ID + "')\"  class=\"delChoose\">&times;</span></span></li>";
            if ($("#li_" + row.HOSP_ID + "").size() == 0) {
                $("#Ul_Hosp_ChoosedData").append(retHtml);
            }
        }

        function clickAllChk(ckstate) {
            if (ckstate) {
                var chooseRows = $("#maingrid").bootgrid("getGridSelRows");
                $(chooseRows).each(function (i, rowData) {
                    addDataToUl(rowData);
                });
            }
        }

        function clearAllData() {
            $("#Ul_Hosp_ChoosedData").empty();
            sch();
        }

        function deleteChooseData(liid) {
            $("#li_" + liid).remove();
        }
    </script>
}
